<template>
    <el-container direction="vertical">
      <el-header>
        <el-menu mode="horizontal" default-active="currentRoute.path" router>
        <el-menu-item index="/basicInfo" class="menu-item" :class="{ 'active': $route.path === '/basicInfo' }">基础信息维护</el-menu-item>
        <el-menu-item index="/extendedInfo" class="menu-item" :class="{ 'active': $route.path === '/extendedInfo' }">机构扩展信息</el-menu-item>
        <el-menu-item index="/serviceFacilities" class="menu-item" :class="{ 'active': $route.path === '/serviceFacilities' }">服务项目和设施</el-menu-item>
        <el-menu-item index="/term" class="menu-item" :class="{ 'active': $route.path === '/term' }">服务条款</el-menu-item>
        <el-menu-item index="/note" class="menu-item" :class="{ 'active': $route.path === '/note' }">须知与注意事项</el-menu-item>
      </el-menu>
       </el-header>
       <el-main>
      <el-form ref="form" :model="form" label-width="120px">
        <el-row>
          <el-form-item label="入院须知">
            <el-input v-model="form.note" type="textarea" :rows="5" :cols="30"></el-input>
          </el-form-item>
        </el-row>
      </el-form>
     
      
      <div class="header-buttons">
        <!-- 其他内容 -->
        <el-button type="primary" @click="update">编辑</el-button>
      </div>
    </el-main>
    </el-container>
 </template>
 
 <script>
 export default {
    data() {
    return {
      form: {
        note: "",
      
      },

    };
  },
  
  methods: {
    update() {
      console.log("信息: ", this.form);
      let mechanismnote = this.form;
      this.$axios
        .post("api/mechanism/updateMechanismnote", mechanismnote)
        .then(res => {
          if (res.data.code == 200) {
            this.$message.success("提交成功!");
            this.queryById();
          
          } else {
            this.$message.error(res.data.msg);
          }
        });
    },

    queryById() {
      this.$axios.get("api/mechanism/queryByNoteId/" + "1").then(res => {
        if (res.data.code == 200) {
          console.log(res.data);
          const originalForm = res.data.data;

          this.form = originalForm;
        }
      });
    }
  },
  created() {
    this.queryById();
  }


 
 }
 </script>
 
 <style>
 .menu-item.active {
   background-color: #3e9ff5; /* 选中菜单项的背景色 */
   color: #333; /* 选中菜单项的文字颜色 */
 }
 .header-buttons {
  display: flex;
  justify-content: flex-end;
}
 </style>
 